<!-- 数据信息 -->
<template>
  <div id="dialog-container">
    <el-button type="primary" plain @click="dialogVisible = true">数据信息</el-button>
    <el-dialog v-dialogDrag title="数据信息"
    
      :fullscreen="isFullScreen"
      :custom-class="isFullScreen?'fullscreen-default-dialog':'vertical-center-dialog'"
      
      :close-on-click-modal="false"
      @close="$emit('update:show', false)"
      :before-close="handleClose"
      :show="show" append-to-body :visible.sync="dialogVisible" width="660px">
      <div slot="title">
        <span style="color:white;">数据信息</span>
        <button
          type="button"
          aria-label="fullScreen"
          class="el-dialog__headerbtn"
          style="margin-right:25px;"
          @click="isFullScreen = !isFullScreen"
        >
          <i class="el-dialog__close iconfont icon-fuzhicopy22"></i>
        </button>
      </div>
      <el-button type="primary" plain @click="getExcel()">导出</el-button>
       <h3 style="text-align: center;">设备利用率详情</h3>
       <!-- <h3 style="text-align: center;">设备使用时间详情</h3> -->
      <br>
      <el-table :data="detailData.usingList" border size="">
        <el-table-column prop="name" align="center" label="设备" min-width="100"></el-table-column>
        <el-table-column :prop="date" v-for='date in detailData.dateList' :key='date' align="center" :label="date" min-width="100"></el-table-column>

        <!-- <el-table-column prop="rate" align="center" label="平均利用时间" min-width="100"></el-table-column> -->
        <el-table-column prop="rate" align="center" label="平均利用率" min-width="100"></el-table-column>
      </el-table>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="dialogVisible = false">关闭</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import LookDetail from './look-detail';
  export default {
    props:[
      'detailData',
      'deviceId'
      ],
    components: {
      'look-detail': LookDetail
    },
    data() {
      return {
        isFullScreen:false,
        dialogVisible: false,
        isShowDetail: false,
        tableData: [{
          date: '2016-05-02',
          name: '王小虎',
          address: ' 1518 弄'
        }, {
          date: '2016-05-04',
          name: '王小虎',
          address: ' 1517 弄'
        }, {
          date: '2016-05-01',
          name: '王小虎',
          address: ' 1519 弄'
        }]
      }
    },
    methods: {
      getExcel() {
        window.location.href= `${process.env.API_URL}` + "report/findDeviceDetailDataInfoExcel?progressId="+this.deviceId.device
        + "&startDate=" + this.deviceId.fromDate + "&endDate=" + this.deviceId.toDate;
      },
      detail(row) {
        this.isShowDetail = true;
      }
    }
  }

</script>
